import React, {Component} from 'react';
import { Transfer} from 'antd';
import TreeTransfer from './treeTransfer';
import PropTypes from 'prop-types';
import '../../assets/stylus/com/dataentry/transfer.styl';
import '../../assets/stylus/com/dataentry/treeTransfer.styl';
import {resetModals, setModalsParam} from "../../state/action/comAction";

class ScTransfer extends Component{
  constructor (props) {
    super();
    this.props = props;
    this.state = {
      targetKeys: []
    }
  }

  static contextTypes = {
    store: PropTypes.object.isRequired
  }

  componentWillMount () {
    this.initialArr = this.context.store.getState().modalInfo.param[this.props.transferConfig.key[1]];
    this.resetTransfer();
    this.context.store.dispatch(resetModals('transferModal', this.resetTransfer.bind(this)));
  }

  handleChange (target) {
    this.context.store.getState().modalInfo.param[this.props.transferConfig.key[1]] = target;
    this.context.store.dispatch(setModalsParam('transferModal', this.context.store.getState().modalInfo.param));
    this.setState({
      targetKeys: target
    })
  }

  resetTransfer () {
    this.setState({
      targetKeys: this.initialArr
    });
  }

  render () {
    return <div className={'sc-transfer'}>
      {this.props.transferConfig.type === 'default' &&
      <Transfer dataSource={this.context.store.getState().modalInfo.param[this.props.transferConfig.key[0]]}
                titles={this.props.transferConfig.titles}
                showSearch
                searchPlaceholder={this.props.transferConfig.placeholder}
                notFoundContent={this.props.transferConfig.nofound}
                itemUnit={this.props.transferConfig.unit}
                onChange={this.handleChange.bind(this)}
                targetKeys= {this.state.targetKeys}
                render={item => item.title}
      />}
      {this.props.transferConfig.type === 'tree' && <TreeTransfer
        showSearch
        source={this.context.store.getState().modalInfo.param[this.props.transferConfig.key[0]]}
        sourceTitle={this.props.transferConfig.titles[0]}
        targetTitle={this.props.transferConfig.titles[1]}
        target={this.state.targetKeys}
        onChange={this.handleChange.bind(this)}
      />}
    </div>
  }
}

export default ScTransfer;

ScTransfer.propsType = {
  transferConfig: PropTypes.object
}